﻿/*-----------------------------全局样式-------------------------------------*/
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,span,a,input,textarea,p,blockquote,th,td,header,nav,footer,article,section,aside,time,figure{margin:0;padding:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}
h1,h2,h3,h4,h5,h6{font-size:14px;font-weight:normal}
ul{list-style:none}
legend{display:none}
fieldset,img{border:none;vertical-align:middle}
em,cite,i{font-style:normal}
input,button,textarea{outline:none;border:0;vertical-align:middle;border:0;font-family:Microsoft YaHei}
input[type="submit"],input[type="reset"],input[type="button"],button {-webkit-appearance:none;border-radius:0}
select{-webkit-appearance:none;-moz-appearance:none;appearance:none}
textarea{resize:none}
html{height:100%;-webkit-text-size-adjust:none;overflow:hidden}
body{font:12px/18px Microsoft YaHei;position:relative;margin:0 auto;color:#000;min-width:320px;word-break:break-all;height:100%;background:#000c20;overflow:hidden;color:#fff;max-width:360px}
body a{color:#fff;text-decoration:none;cursor:pointer}
body a:hover,body a:active,body a:focus{text-decoration:none;outline:none}
/*-----------------------------框架-------------------------------------*/
#wrapper{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;overflow:hidden}
.iScrollVerticalScrollbar{position:absolute;right:0;top:0;height:100%;width:4px}
.iScrollIndicator{position:absolute;right:0;background:rgba(255,255,255,0.2);width:4px;border-radius:2px}
.page{width:100%;position:relative;overflow:hidden;height:100%}
.full-img img{width:100%;display:block}
.auto-x{left:0;right:0;position:absolute;margin:auto}
.auto-y{top:0;bottom:0;position:absolute;margin:auto}
.swiper-container{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;overflow:hidden}
.swiper-slide{height:100%;position:relative;overflow:hidden}
.up{position:absolute;left:0;right:0;bottom:0;width:22px;height:34px;margin:auto;display:none;z-index:1000}
.ups{width:22px;height:14px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/up.png) no-repeat;background-size:100%;z-index:100;animation:up 1s ease-in infinite;-moz-animation:up 1s ease-in infinite;-webkit-animation:up 1s ease-in infinite;position:absolute;left:0;bottom:10px}
@-keyframes up{0%{bottom:0;opacity:0}50%{bottom:10px;opacity:1}100%{bottom:20px;opacity:0}}
@-moz-keyframes up{0%{bottom:0;opacity:0}50%{bottom:10px;opacity:1}100%{bottom:20px;opacity:0}}
@-webkit-keyframes up{0%{bottom:0;opacity:0}50%{bottom:10px;opacity:1}100%{bottom:20px;opacity:0}}
/*-----------------------------音乐-------------------------------------*/
#music{position:absolute;width:24px;height:24px;right:8px;top:8px;z-index:400}
.music{width:100%;height:100%;background:url(http://dn-h6app.qbox.me/static/images/pingwest/music.png) no-repeat center center;background-size:100%;z-index:10;position:relative}
.play{animation:rotate 1.2s linear infinite;-webkit-animation:rotate 1.2s linear infinite}
#music>span{color:#fff;position:absolute;left:-60px;top:0;line-height:24px;font-size:14px;opacity:0;-webkit-transition:all 0.3s linear;transition:all 0.3s linear}
#music>span.zshow{left:-30px;opacity:1}
@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(360deg)}}
/*-----------------------------首页-------------------------------------*/
/*----------------第一屏---------------------*/
#page-1 .title{width:195px;height:45px;top:75px}
.tel{width:195px;height:409px;bottom:-60px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/tel.png) no-repeat;background-size:100%}
.tel:after{position:absolute;content:"";width:187px;height:141px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/tels.png) no-repeat;background-size:100%;top:37px;left:0;z-index:100}
.paper{width:94px;height:235px;position:absolute;left:76px;top:13px}
.paper-animate{animation:paper-animate 2s linear infinite;-webkit-animation:paper-animate 2s linear infinite}
@keyframes paper-animate{0%{transform:translate(0,0)}100%{transform:translate(0,-50px)}}
@-webkit-keyframes paper-animate{0%{-webkit-transform:translate(0,0)}100%{-webkit-transform:translate(0,-50px)}}
/*----------------第二屏---------------------*/
#page-2{background:url(http://dn-h6app.qbox.me/static/images/pingwest/map.jpg) no-repeat;background-size:100%}
.point{width:36px;height:56px;position:absolute;top:268px;left:112px}
.point:after{position:absolute;left:0;right:0;margin:auto;top:0;bottom:0;background:url(http://dn-h6app.qbox.me/static/images/pingwest/point.png) no-repeat;background-size:100%;content:"";z-index:10}
.point h3{position:absolute;color:#ff4f28;font-size:12px;left:32px;top:38px;width:6em}
.bo{background:#ff4f28;width:10px;height:10px;border-radius:5px;left:12px;top:42px;position:absolute}
.leida{animation:leida 2s linear infinite;-webkit-animation:leida 2s linear infinite}
@keyframes leida{0%{transform:scale(1,1);opacity:1}100%{transform:scale(12,12);opacity:0}}
@-webkit-keyframes leida{0%{-webkit-transform:scale(1,1);opacity:1}100%{-webkit-transform:scale(12,12);opacity:0}}
.note{width:127px;height:227px;left:0;top:0;position:absolute}
/*----------------第三屏---------------------*/
#page-3 .title{width:239px;height:43px;top:50px}
#page-3 .title-2{width:219px;height:36px;top:274px}
.huan-button{width:138px;height:138px;top:328px}
.huan-text{width:78px;height:57px}
.huan-rotate-1{animation:huan-rotate-1 12s linear infinite;-webkit-animation:huan-rotate-1 12s linear infinite}
@keyframes huan-rotate-1{0%{transform:rotate(0)}100%{transform:rotate(-360deg)}}
@-webkit-keyframes huan-rotate-1{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(-360deg)}}
.huan-rotate-2{animation:huan-rotate-2 12s linear infinite;-webkit-animation:huan-rotate-2 12s linear infinite}
@keyframes huan-rotate-2{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@-webkit-keyframes huan-rotate-2{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(360deg)}}
.tag{width:191px;height:117px;top:125px}
.tag>div{position:absolute;width:78px;height:26px;text-align:center;line-height:26px;font-size:15px;top:0;opacity:0.5}
.tag-1{left:0;border:#259bd8 1px solid;color:#259bd8}
.tag-2{left:38px;border:#56c8c8 1px solid;color:#56c8c8}
.tag-3{right:0;border:#076081 1px solid;color:#076081}
.tag-4{left:83px;border:#56c8c8 1px solid;color:#56c8c8}
.tag-5{left:20px;border:#2e5ba5 1px solid;color:#2e5ba5}
.tag-6{right:20px;border:#259bd8 1px solid;color:#259bd8}
.tag-1-move{animation:tag-1-move 8s linear infinite;-webkit-animation:tag-1-move 8s linear infinite}
.tag-2-move{animation:tag-2-move 8s -1s linear infinite;-webkit-animation:tag-2-move 8s -1s linear infinite}
.tag-3-move{animation:tag-3-move 8s -2s linear infinite;-webkit-animation:tag-3-move 8s -2s linear infinite}
.tag-4-move{animation:tag-4-move 8s -3s linear infinite;-webkit-animation:tag-4-move 8s -3s linear infinite}
.tag-5-move{animation:tag-4-move 8s -4s linear infinite;-webkit-animation:tag-4-move 8s -4s linear infinite}
.tag-6-move{animation:tag-4-move 8s -5s linear infinite;-webkit-animation:tag-4-move 8s -5s linear infinite}
@keyframes tag-1-move{0%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{transform:translate(50px,50px) scale(1,1);opacity:1}50%{transform:translate(100px,100px) scale(0.8,0.8);opacity:0.5}75%{transform:translate(50px,50px) scale(0.6,0.6);opacity:0.2}100%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@-webkit-keyframes tag-1-move{0%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{-webkit-transform:translate(50px,50px) scale(1,1);opacity:1}50%{-webkit-transform:translate(100px,100px) scale(0.8,0.8);opacity:0.5}75%{-webkit-transform:translate(50px,50px) scale(0.6,0.6);opacity:0.2}100%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@keyframes tag-2-move{0%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{transform:translate(30px,50px) scale(1,1);opacity:1}50%{transform:translate(60px,100px) scale(0.8,0.8);opacity:0.5}75%{transform:translate(30px,50px) scale(0.6,0.6);opacity:0.2}100%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@-webkit-keyframes tag-2-move{0%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{-webkit-transform:translate(30px,50px) scale(1,1);opacity:1}50%{-webkit-transform:translate(60px,100px) scale(0.8,0.8);opacity:0.5}75%{-webkit-transform:translate(30px,50px) scale(0.6,0.6);opacity:0.2}100%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@keyframes tag-3-move{0%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{transform:translate(-50px,50px) scale(1,1);opacity:1}50%{transform:translate(-100px,100px) scale(0.8,0.8);opacity:0.5}75%{transform:translate(-50px,50px) scale(0.6,0.6);opacity:0.2}100%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@-webkit-keyframes tag-3-move{0%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{-webkit-transform:translate(-50px,50px) scale(1,1);opacity:1}50%{-webkit-transform:translate(-100px,100px) scale(0.8,0.8);opacity:0.5}75%{-webkit-transform:translate(-50px,50px) scale(0.6,0.6);opacity:0.2}100%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@keyframes tag-4-move{0%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{transform:translate(0,50px) scale(1,1);opacity:1}50%{transform:translate(0,100px) scale(0.8,0.8);opacity:0.5}75%{transform:translate(0,50px) scale(0.6,0.6);opacity:0.2}100%{transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
@-webkit-keyframes tag-4-move{0%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}25%{-webkit-transform:translate(0,50px) scale(1,1);opacity:1}50%{-webkit-transform:translate(0,100px) scale(0.8,0.8);opacity:0.5}75%{-webkit-transform:translate(0,50px) scale(0.6,0.6);opacity:0.2}100%{-webkit-transform:translate(0,0) scale(0.8,0.8);opacity:0.5}}
/*----------------第四屏---------------------*/
#page-4 .title{width:271px;height:23px;top:10px}
.head{width:225px;height:274px;position:absolute;background:url(http://dn-h6app.qbox.me/static/images/pingwest/head.png) no-repeat;background-size:100%;left:30px;right:0;margin:auto;top:38px}
#page-4 .text{width:235px;height:316px;position:absolute;left:30px;top:178px}
#page-4 .border-1{right:32px;position:absolute;width:1px;height:800px;top:312px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/solid.png) repeat-y right top;background-size:1px}
#page-4 .border-2{left:27px;position:absolute;width:0;height:19px;bottom:0;width:261px;background:#000c20 url(http://dn-h6app.qbox.me/static/images/pingwest/solid-y.png) repeat-x;background-size:auto 1px}
#page-4 .border-2:before{position:absolute;left:0;top:0;height:100%;content:"";background:url(http://dn-h6app.qbox.me/static/images/pingwest/solid-y.png) repeat-y;background-size:1px;width:1px}
.guang{width:130px;height:25px;position:absolute;background:url(http://dn-h6app.qbox.me/static/images/pingwest/guang.png) no-repeat;background-size:100%}
.guang-1{animation:guang-1 1s linear infinite;-webkit-animation:guang-1 1s linear infinite}
.guang-2{left:-50px;top:30px;animation:guang-2 1s -0.2s linear infinite;-webkit-animation:guang-2 1s -0.2s linear infinite}
.guang-3{left:-50px;top:50px;animation:guang-3 1s -0.4s linear infinite;-webkit-animation:guang-3 1s -0.4s linear infinite}
.guang-4{left:-50px;top:80px;animation:guang-4 1s -0.8s linear infinite;-webkit-animation:guang-4 1s -0.8s linear infinite}
@keyframes guang-1{0%{transform:translate(0,0);opacity:0}50%{opacity:1}100%{transform:translate(80px,0);opacity:0}}
@-webkit-keyframes guang-1{0%{-webkit-transform:translate(0,0);opacity:0}50%{opacity:1}100%{-webkit-transform:translate(80px,0);opacity:0}}
@keyframes guang-2{0%{transform:translate(0,0);opacity:0}50%{opacity:1}100%{transform:translate(170px,0);opacity:0}}
@-webkit-keyframes guang-2{0%{-webkit-transform:translate(0,0);opacity:0}50%{opacity:1}100%{-webkit-transform:translate(170px,0);opacity:0}}
@keyframes guang-3{0%{transform:translate(0,0);opacity:0}50%{opacity:1}100%{transform:translate(170px,0);opacity:0}}
@-webkit-keyframes guang-3{0%{-webkit-transform:translate(0,0);opacity:0}50%{opacity:1}100%{-webkit-transform:translate(170px,0);opacity:0}}
@keyframes guang-4{0%{transform:translate(0,0);opacity:0}50%{opacity:1}100%{transform:translate(170px,0);opacity:0}}
@-webkit-keyframes guang-4{0%{-webkit-transform:translate(0,0);opacity:0}50%{opacity:1}100%{-webkit-transform:translate(170px,0);opacity:0}}
/*----------------第五屏---------------------*/
#page-5{background:url(http://dn-h6app.qbox.me/static/images/pingwest/road.png) no-repeat 23px center;background-size:85px}
#page-5 .text{width:229px;height:592px;position:absolute;left:70px;top:12px}
.car{width:36px;height:85px;position:absolute;top:0;left:27px}
.plan{width:115px;height:118px;position:absolute;bottom:21px;left:-24px}
/*----------------第六屏---------------------*/
#page-6{background:url(http://dn-h6app.qbox.me/static/images/pingwest/computer.png) no-repeat left top;background-size:100%}
#page-6 .title{width:208px;height:95px;position:absolute;left:56px;top:4px}
#page-6 .text{width:175px;height:112px;position:absolute;left:88px;top:313px}
.game{height:90px;width:179px;position:absolute;left:71px;top:132px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/eat.png) no-repeat;background-size:100%}
.eat-author{position:absolute;width:17px;height:17px;position:absolute;left:0;top:0;z-index:100}
.game li{height:18px;background:#000c20;width:0;position:absolute}
.game li:nth-child(even){right:0;top:0}
.game li:nth-child(odd){left:0;top:0}
.game li:nth-child(1){top:0}
.game li:nth-child(2){top:18px}
.game li:nth-child(3){top:36px}
.game li:nth-child(4){top:54px}
.game li:nth-child(5){top:72px}
.over{width:159px;height:22px;visibility:hidden}
/*----------------第七屏---------------------*/
#page-7{background:url(http://dn-h6app.qbox.me/static/images/pingwest/house.png) no-repeat left top;background-size:100%}
#page-7 .border-2{left:57px;position:absolute;width:0;height:19px;bottom:0;width:211px;background:#000c20 url(http://dn-h6app.qbox.me/static/images/pingwest/solid-y.png) repeat-x;background-size:auto 1px}
#page-7 .border-2:before{position:absolute;left:0;top:0;height:100%;content:"";background:url(http://dn-h6app.qbox.me/static/images/pingwest/solid-y.png) repeat-y;background-size:1px;width:1px}
.cloud-1{position:absolute;width:64px;height:36px;right:74px;top:47px}
.cloud-2{position:absolute;width:50px;height:29px;right:146px;top:100px}
#page-7 .text{width:189px;height:208px;position:absolute;left:42px;top:291px}
.shadow{position:absolute;top:160px;height:81px;width:202px;left:57px}
.shadow li{width:5px;height:5px;position:absolute}
.color-1{background:#fff}
.color-2{background:#873cd3}
.color-3{background:#4b8f19}
.color-4{background:#973636}
.color-5{background:#fbfe00}
.shadow li:nth-child(1){left:1px;top:46px}
.shadow li:nth-child(2){left:1px;top:56px}
.shadow li:nth-child(3){left:1px;top:76px}
.shadow li:nth-child(4){left:8px;top:23px}
.shadow li:nth-child(5){left:8px;top:36px}
.shadow li:nth-child(6){left:13px;top:56px}
.shadow li:nth-child(7){left:13px;top:66px}
.shadow li:nth-child(8){left:13px;top:76px}
.shadow li:nth-child(9){left:30px;top:0}
.shadow li:nth-child(10){left:30px;top:11px}
.shadow li:nth-child(11){left:30px;top:31px}
.shadow li:nth-child(12){left:30px;top:52px}
.shadow li:nth-child(13){left:37px;top:0}
.shadow li:nth-child(14){left:37px;top:21px}
.shadow li:nth-child(15){left:37px;top:31px}
.shadow li:nth-child(16){left:37px;top:41px}
.shadow li:nth-child(17){left:37px;top:62px}
.shadow li:nth-child(18){left:44px;top:11px}
.shadow li:nth-child(19){left:44px;top:31px}
.shadow li:nth-child(20){left:44px;top:52px}
.shadow li:nth-child(21){left:51px;top:0}
.shadow li:nth-child(22){left:51px;top:41px}
.shadow li:nth-child(23){left:67px;top:36px}
.shadow li:nth-child(24){left:67px;top:56px}
.shadow li:nth-child(25){left:67px;top:67px}
.shadow li:nth-child(26){left:74px;top:25px}
.shadow li:nth-child(27){left:74px;top:46px}
.shadow li:nth-child(28){left:74px;top:56px}
.shadow li:nth-child(29){left:74px;top:76px}
.shadow li:nth-child(30){left:81px;top:36px}
.shadow li:nth-child(31){left:88px;top:46px}
.shadow li:nth-child(32){left:88px;top:56px}
.shadow li:nth-child(33){left:88px;top:76px}
.shadow li:nth-child(34){left:95px;top:56px}
.shadow li:nth-child(35){left:123px;top:66px}
.shadow li:nth-child(36){left:130px;top:36px}
.shadow li:nth-child(37){left:130px;top:46px}
.shadow li:nth-child(38){left:130px;top:76px}
.shadow li:nth-child(39){left:137px;top:46px}
.shadow li:nth-child(40){left:137px;top:76px}
.shadow li:nth-child(41){left:156px;top:66px}
.shadow li:nth-child(42){left:163px;top:36px}
.shadow li:nth-child(43){left:163px;top:46px}
.shadow li:nth-child(44){left:163px;top:56px}
.shadow li:nth-child(45){left:163px;top:66px}
.shadow li:nth-child(46){left:163px;top:76px}
.shadow li:nth-child(47){left:170px;top:36px}
.shadow li:nth-child(48){left:170px;top:46px}
.shadow li:nth-child(49){left:170px;top:56px}
.shadow li:nth-child(50){left:170px;top:66px}
.shadow li:nth-child(51){left:170px;top:76px}
.shadow li:nth-child(52){left:188px;top:46px}
.shadow li:nth-child(53){left:188px;top:56px}
.shadow li:nth-child(54){left:188px;top:66px}
.shadow li:nth-child(55){left:188px;top:76px}
.shadow li:nth-child(56){left:195px;top:66px}
.shadow li:nth-child(57){left:195px;top:76px}
/*----------------第八屏---------------------*/
#page-8{background:url(http://dn-h6app.qbox.me/static/images/pingwest/cp.png) no-repeat 57px top;background-size:108px}
.cp{width:193px;height:193px;left:62px;top:66px;position:absolute}
.cp-rotate-animate{animation:cp-rotate-animate 16s linear infinite;-webkit-animation:cp-rotate-animate 16s linear infinite}
@keyframes cp-rotate-animate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@-webkit-keyframes cp-rotate-animate{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(360deg)}}
#page-8 .text{width:142px;height:255px;position:absolute;left:110px;top:272px}
.cp li{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;opacity:0}
.cp-1{width:31px;height:31px}
.cp-2{width:19px;height:30px}
.cp-3{width:29px;height:28px}
.cp-4{width:21px;height:23px}
.cp-5{width:13px;height:25px}
.cp-6{width:20px;height:23px}
.cp-7{width:29px;height:29px}
.cp-8{width:19px;height:20px}
/*----------------第九屏---------------------*/
#page-9{background:url(http://dn-h6app.qbox.me/static/images/pingwest/household.png) no-repeat 25px top;background-size:268px}
#page-9 .text{width:204px;height:274px;position:absolute;left:35px;top:254px}
.wifi{width:51px;height:38px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/wifi.png) no-repeat left 0;background-size:100%;position:absolute;left:60px;top:210px}
.get{width:52px;height:38px;position:absolute;left:188px;top:72px}
.xinhao{width:24px;height:16px;position:absolute;left:0;top:0;background:url(http://dn-h6app.qbox.me/static/images/pingwest/xinhao.png) no-repeat left -32px;background-size:100%}
.s{width:4px;height:2px;background:#8dc63f;position:absolute;left:6px;top:23px}
.s-2{background:#ed1c24;top:27px}
/*----------------第十屏---------------------*/
#page-10{background:url(http://dn-h6app.qbox.me/static/images/pingwest/box.jpg) no-repeat;background-size:100%}
.man{width:84px;height:206px;top:96px;opacity:0}
#page-10 .text{width:150px;height:43px;top:374px}
/*----------------第十一屏---------------------*/
#page-11 .text{width:164px;height:71px;top:90px;left:50px;position:absolute}
#page-11 .title{width:223px;height:115px;top:240px}
/*----------------第十二屏---------------------*/
a.button{color:#fff;width:140px;height:27px;line-height:27px;text-align:center;border:#0090ff 1px solid;background:#1c3052;border-radius:5px;-webkit-transform:rotate(0.00001deg)}
a.button:hover{background:#192a47}
.end{width:262px;height:172px;background:#264396;border-radius:10px}
.end p{line-height:20px;color:#fff;text-align:center;padding:8px 0;background:#0090ff;border-radius:10px 10px 0 0;margin:0 0 40px}

/*-----------------------------结果页-------------------------------------*/
.form{position:absolute;left:0;top:0;visibility:hidden;z-index:100}
.form form{position:absolute;left:30px;right:30px;top:38px;bottom:0;margin:auto}
.form li{height:40px;border-bottom:#0090ff 1px solid;position:relative;padding:0 0 0 70px}
.form label{position:absolute;left:0;width:70px;text-align:center;line-height:40px;color:#0090ff}
.form input{height:40px;width:100%;background:none;color:#fff;font-size:12px}
.form ul{margin:0 0 40px}
.form input.submit{height:36px;color:#fff;color:#0090ff;border:#0090ff 2px solid;font-size:14px;cursor:pointer}
.form input.submit:hover{background-color:#00050c}
.result{z-index:10;visibility:hidden;position:absolute;left:0;top:0;background:#000c20}
.result-div{position:absolute;left:22px;right:22px;top:38px;bottom:0;margin:auto}
.result-div .full-img{margin:27px 10px 15px}
.result-div .text{line-height:28px;font-size:11px;margin:0 0 22px}
.gua{width:275px;height:160px;margin:0 auto 46px;background:url(http://dn-h6app.qbox.me/static/images/pingwest/gua.png) no-repeat;background-size:100%;border-radius:5px}
#canvas{width:100%;height:100%}
.result a.button{top:auto;bottom:52px}
.share{position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.9) url(http://dn-h6app.qbox.me/static/images/pingwest/share.png) no-repeat right top;background-size:81px;visibility:hidden}
.share-text{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;text-align:center;line-height:28px;font-size:15px;color:#fff;font-weight:bold;height:56px}
.share strong{color:#ff1818}

/*-----------------------------屏幕补充-------------------------------------*/
/*for iphone4 weixin*/
@media screen and (max-height:416px){
#page-1 .title{top:30px}
.tel{bottom:-120px}
#page-3 .title{top:20px}
#page-3 .tag{top:85px}
#page-3 .title-2{top:224px}
#page-3 .huan-button{top:268px}
#page-10 .text{top:354px}
.result-div{top:0}
/*----------------结果页---------------------*/
.form form{top:20px}
.form ul{margin:0 0 30px}
.result-div{top:0}
.result .full-img{margin:10px}
.result a.button{bottom:20px}
}
/*for android-720 weixin*/
@media screen and (min-width:360px){
.page{height:567px}
/*----------------第一屏---------------------*/
.tel{bottom:-20px}
/*----------------第二屏---------------------*/
.point{left:128px;top:308px}
/*----------------第四屏---------------------*/
#page-4 .title{top:20px}
.head{left:70px;top:50px}
#page-4 .text{left:50px;top:230px}
#page-4 .border-1{top:324px}
#page-4 .border-2{width:301px}
/*----------------第五屏---------------------*/
#page-5 .text{left:100px;top:24px}
/*----------------第六屏---------------------*/
#page-6{background-position:-3px top}
#page-6 .title{left:62px;top:12px}
#page-6 .text{top:350px}
.game{left:90px;top:154px}
/*----------------第七屏---------------------*/
#page-7{background-position:-3px top}
#page-7 .border-2{width:242px}
#page-7 .text{top:320px;width:214px}
.shadow{top:186px;height:88px;width:226px;left:66px}
.shadow li:nth-child(9){left:32px}
.shadow li:nth-child(10){left:32px}
.shadow li:nth-child(11){left:32px}
.shadow li:nth-child(12){left:32px}
.shadow li:nth-child(13){left:39px}
.shadow li:nth-child(14){left:39px}
.shadow li:nth-child(15){left:39px}
.shadow li:nth-child(16){left:39px}
.shadow li:nth-child(17){left:39px}
.shadow li:nth-child(18){left:46px}
.shadow li:nth-child(19){left:46px}
.shadow li:nth-child(20){left:46px}
.shadow li:nth-child(21){left:53px}
.shadow li:nth-child(22){left:53px}
.shadow li:nth-child(23){left:71px}
.shadow li:nth-child(24){left:71px}
.shadow li:nth-child(25){left:71px}
.shadow li:nth-child(26){left:78px}
.shadow li:nth-child(27){left:78px}
.shadow li:nth-child(28){left:78px}
.shadow li:nth-child(29){left:78px}
.shadow li:nth-child(30){left:85px}
.shadow li:nth-child(31){left:92px}
.shadow li:nth-child(32){left:92px}
.shadow li:nth-child(33){left:92px}
.shadow li:nth-child(34){left:99px}
.shadow li:nth-child(35){left:136px}
.shadow li:nth-child(36){left:143px}
.shadow li:nth-child(37){left:143px}
.shadow li:nth-child(38){left:143px}
.shadow li:nth-child(39){left:150px}
.shadow li:nth-child(40){left:150px}
.shadow li:nth-child(41){left:174px}
.shadow li:nth-child(42){left:181px}
.shadow li:nth-child(43){left:181px}
.shadow li:nth-child(44){left:181px}
.shadow li:nth-child(45){left:181px}
.shadow li:nth-child(46){left:181px}
.shadow li:nth-child(47){left:188px}
.shadow li:nth-child(48){left:188px}
.shadow li:nth-child(49){left:188px}
.shadow li:nth-child(50){left:188px}
.shadow li:nth-child(51){left:188px}
.shadow li:nth-child(52){left:209px}
.shadow li:nth-child(53){left:209px}
.shadow li:nth-child(54){left:209px}
.shadow li:nth-child(55){left:209px}
.shadow li:nth-child(56){left:216px}
.shadow li:nth-child(57){left:216px}
/*----------------第八屏---------------------*/
#page-8 .text{width:158px;top:290px}
/*----------------第九屏---------------------*/
#page-9 .text{width:232px}
/*----------------第十屏---------------------*/
.man{width:95px;top:108px}
#page-10 .text{width:169px;top:420px}
/*----------------第十一屏---------------------*/
#page-11 .text{width:185px;top:102px;left:56px}
#page-11 .title{width:250px;top:270px}
/*----------------结果页---------------------*/
.form form{left:34px;right:34px;top:43px}
.result-div .text{line-height:31px;font-size:12px;padding:0 0 0 6px;margin:0 0 25px}
.form li{height:42px;padding:0 0 0 80px}
.form label{width:80px;line-height:42px;font-size:13px}
.form input{height:42px;font-size:13px}
.form input.submit{height:42px;font-size:16px}
.share{background-size:91px}
.share-text{height:64px;line-height:32px;font-size:17px}
}
